<script setup>
import * as THREE from 'three';
import { OrbitControls } from 'three/addons/controls/OrbitControls.js';
import { GLTFLoader } from 'three/examples/jsm/loaders/GLTFLoader.js';
import Stats from 'three/addons/libs/stats.module.js';
const stats = new Stats();
//stats.domElement:web页面上输出计算结果,一个div元素，
document.body.appendChild(stats.domElement);
// import mo from './assets/su7.gbl'
const scene = new THREE.Scene();
const camera = new THREE.PerspectiveCamera( 75, window.innerWidth / window.innerHeight, 0.1, 1000 );

const renderer = new THREE.WebGLRenderer();
renderer.setSize( 500, 500,false );
document.body.appendChild( renderer.domElement );
const light = new THREE.AmbientLight(0xffffff, 1); // 环境光
scene.add(light);
// 加载 GLB 模型
const loader = new GLTFLoader();
loader.load('http://localhost:5173/assets/su7.glb', (gltf) => {
    scene.add(gltf.scene);
    // 如果需要，可以设置模型的位置
    gltf.scene.position.set(0, 0, 0);
}, undefined, (error) => {
    console.error(error);
});
// 相机位置
camera.position.z = 5;
// 设置相机控件轨道控制器OrbitControls
const controls = new OrbitControls(camera, renderer.domElement);
// 如果OrbitControls改变了相机参数，重新调用渲染器渲染三维场景
controls.addEventListener('change', function () {
    renderer.render(scene, camera); //执行渲染操作
});//监听鼠标、键盘事件

// 动画循环
const animate = function () {
  stats.update();
    requestAnimationFrame(animate);
    renderer.render(scene, camera);
};
animate();
</script>

<template>
  <div>
    asd
  </div>
</template>

<style scoped>

</style>
